/* http://kodcss.pl/kurs-css/lekcje/dzial-4/rozwijane-poziome-menu-css */

/* to jest menu pierwszego poziomu */

ol
	{
		list-style-type:none;
		padding:0;
		margin:0;
		font-size:18px;
		text-align:center;
		height: 2em;
		line-height:2em;
		background-color: #FFF;
	}
	
ol > li
	{
		float:left;
		background-color: #FDD700;
		width: 150px;
		margin-left: 1px;
	}
	
ol > li:first-child
	{
		margin-left:0;
	}	
	
ol > li > a
	{
		display:block;
		text-decoration: none;
		color:#000;
		padding: 0 5 px;
	}	

ol > li > a:hover
	{
		color:Blue;
	
	}

ol > li:hover
	{
		background-color:#EEE; /*ten element odpowiada za to że podswietla sie calosc gdy najedziemy na el ponizej*/
	}
	
	
/* to jest menu drugiego poziomu*/	

ol > li > ul
	{
		list-style-type:none;
		padding:0;
		margin:0;
		display:none;
	}

ol > li:hover > ul
	{
		display:block;
	}
	
ol > li > ul > li 
	{
		background-color: #EEE:
		border-top: 1px solid #FFF;
	}
	
ol > li > ul > li:hover
	{
		background-color: #DDD;
	}	
	
	
	
	/* 3 poziom*/
	
ol > li > ul > li > ul
	{
		list-style-type:none;
		padding:0;
		margin:0;
		display:none;
	
	}	

ol > li > ul > li:hover > ul
	{
		display:block;
	}
	
ol > li > ul > li > ul > li 
	{
		background-color: #EEE:
		border-top: 1px solid #FFF;
	}
	
ol > li > ul > li > ul > li:hover
	{
		background-color: Green;
	}		
	
ol ul ul
	{
		left:100%;
		top:0;
	
	}	
	
 li:hover > ul
	{
		display:block;
	}
	